<div style="width: 600px;">
    <h1 mat-dialog-title style="display:inline-block;cursor:move;" mat-dialog-draggable>{{'dlg.textproperty-title' | translate}}</h1>
    <mat-icon (click)="onNoClick()" style="float:right;margin-right:-10px;margin-top:-10px;cursor:pointer;color:gray;">clear</mat-icon>
    <div mat-dialog-content *ngIf="data.editmode < 0">
		{{'msg.text-remove' | translate}} ({{data.text.name}}) '{{data.text.value}}' ?
	</div>
    <div mat-dialog-content *ngIf="data.editmode >= 0">
        <div class="my-form-field" style="display: inline-block;margin-bottom: 10px;">
            <span>{{'dlg.textproperty-id' | translate}}</span>
            <input [(ngModel)]="data.text.name" type="text" (change)="checkValid()">
        </div>
        <div class="my-form-field" style="margin-bottom: 10px;padding-left: 20px;float: right;">
            <span>{{'dlg.textproperty-group' | translate}}</span>
            <input [(ngModel)]="data.text.group" type="text" (change)="checkValid()" style="width:325px">
        </div>
        <div class="my-form-field" style="display: block;margin-bottom: 10px;width: 100%;">
            <span>{{'dlg.textproperty-value' | translate}}</span>
            <input [(ngModel)]="data.text.value" type="text" (change)="checkValid()" style="width: 545px;">
        </div>
        <div style="height: 20px">
            <div class="message-error" *ngIf="errorExist">
                <span>{{'msg.textproperty-error-exist' | translate}}</span>
            </div>
            <div class="message-error" *ngIf="errorMissingValue">
                <span>{{'msg.textproperty-missing-value' | translate}}</span>
            </div>
        </div>
    </div>
    <div mat-dialog-actions class="dialog-action">
        <button mat-raised-button (click)="onNoClick()">{{'dlg.cancel' | translate}}</button>
        <button mat-raised-button color="primary" (click)="onOkClick()" cdkFocusInitial>{{'dlg.ok' | translate}}</button>
    </div>
</div>